import 'package:flutter/material.dart';

class ImagePage extends StatelessWidget {
  const ImagePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Image.network(
        'https://flutter.dev/assets/homepage/carousel/slide_1-layer_0-7b4c4b7e7f0dfd850b29217e9bc3b249.png',

        // 图像框尺寸和布局相关
        width: 200,
        height: 200,
        fit: BoxFit.cover, // 填充方式
        alignment: Alignment.center, // 对齐方式
        repeat: ImageRepeat.noRepeat, // 重复模式

        // 图像加载相关
        loadingBuilder: (context, child, loadingProgress) {
          if (loadingProgress == null) return child;
          return CircularProgressIndicator(
            value: loadingProgress.expectedTotalBytes != null
                ? loadingProgress.cumulativeBytesLoaded /
                (loadingProgress.expectedTotalBytes!)
                : null,
          );
        },

        // 出错时的占位图
        errorBuilder: (context, error, stackTrace) {
          return const Icon(Icons.error, size: 100, color: Colors.red);
        },

        // 缓存和性能相关
        cacheWidth: 400,
        cacheHeight: 400,
        filterQuality: FilterQuality.high, // 渲染质量

        // 色彩相关
        color: Colors.blue.withOpacity(0.5), // 着色
        colorBlendMode: BlendMode.colorBurn, // 混合模式

        // 可访问性
        semanticLabel: 'Flutter Logo',

        // 动画图像的帧同步
        frameBuilder: (context, child, frame, wasSynchronouslyLoaded) {
          return AnimatedOpacity(
            opacity: frame == null ? 0 : 1,
            duration: const Duration(seconds: 1),
            child: child,
          );
        },

        isAntiAlias: true, // 抗锯齿

        // 用于语义描述
        excludeFromSemantics: false,
      ),
    );
  }
}
